<template>
  <m-layout>
    <mt-header slot="header" title="战术板" />
    <div slot="body" class="tactical">
      <m-section>
        <div class="heading heading-3">运动类型</div>
        <!--<router-link  v-for="item in sporttype" :key="item.id" :to="{path: `/tacticalSportTypes/${item.id}`}">-->
        <router-link  v-for="item in sportType"
                      :key="item.id"
                      :to="{
                      name: 'tacticalSportTypes',
                      params: {id: item.id},
                      query: {authOrgId: $route.query.authOrgId}
                    }">
          <mt-cell class="sport-item" :title="item.title" is-link></mt-cell>
        </router-link>
      </m-section>
    </div>
  </m-layout>
</template>

<script>
import { mapState } from 'vuex'

export default {
  computed: {
    ...mapState({
      sportType: state => state.tactical.sportType
    })
  },
  data () {
    return {
      value: ''
    }
  },
  mounted () {
    this.$store.dispatch('tactical/sportType', {
      lang: 'zh_CN'
    })
  }
}
</script>

<style lang="scss" scoped>
</style>
